<template>
    <div class="score">
        <div class="score-head">测试结果</div>
        <div class="score-container">
            <p>您的得分是: {{score}} </p>
        </div>
        
    </div>
</template>

<script setup>
//获取仓库中的问题数据
//获取仓库中的用户答案
//计算得分
import { onMounted ,ref} from 'vue';
import useQuestionStore from '../store/question';

const questionStore = useQuestionStore();
const score = ref(0); //分数
onMounted(() =>{
    score.value = questionStore.calculateScore();
})
</script>

<style lang="less" scoped>
.score{
    width: 100vw;
    height: 100vh;
    .score-head{
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        color: #333;
        border-bottom: #333 solid 1px;
    }
    .score-container{
        width: 100%;
        height: 100%;
        text-align: center;
        font-size: 25px;
        font-weight:700;
        overflow: hidden;
        p{
            margin-top: 50px;
            color: #333;
        }
    }
}
</style>